<template>
    <div class="w-full box-border p-16px">
        <el-card>
            <el-tabs v-model="activeName" class="demo-tabs" @tab-click="handleClick">
                <el-tab-pane label="长期保" name="long">
                    <div class="wrapper">
                        <long />
                    </div>
                </el-tab-pane>
                <el-tab-pane label="日日保" name="day">
                    <div class="wrapper">
                        <day />
                    </div>
                </el-tab-pane>
                <el-tab-pane label="团意险" name="weteam">
                    <div class="wrapper">
                        <weteam />
                    </div>
                </el-tab-pane>
            </el-tabs>
        </el-card>
    </div>
</template>
<script setup>
import { ref } from 'vue'
import long from './components/long.vue'
import day from './components/day.vue'
import weteam from './components/weteam.vue'
const activeName = ref('long')
const handleClick = (ev) => {
    console.log(1111, ev)
}
</script>
<style lang="scss" scoped>
.container {
    padding: 0 15px;
    position: relative;
    z-index: 120;
}
.wrapper {
}
.demo-tabs {
    background: #fff;
}
:deep(.el-tabs__nav-scroll) {
    padding-left: 16px;
}
</style>